<%@page import="java.util.*"%>
<%@page import="java.text.*"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%
    String path = request.getContextPath(); 
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+path+ "/"; 
     
%>
<!DOCTYPE HTML>
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
	<title>新增或修改学员故事</title>
	<link rel="stylesheet" href="bootstrap-3.3.7-dist/css/bootstrap.min.css" />
	<link rel="stylesheet" href="css/bootstrap-datetimepicker.css" />
    <link rel="stylesheet" href="bootstrap-table/dist/bootstrap-table.css">
    <link rel="stylesheet" type="text/css" href="css/xcConfirm.css" />
	<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400,300" />
	<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
	<link rel="stylesheet" href="bootstrap-fileinput-master/css/fileinput.min.css">
    
    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="css/font.css">
    <link rel="stylesheet" href="css/xadmin.css">
    <link href="umeditor/themes/default/css/umeditor.css" type="text/css"
      	rel="stylesheet">
    
    <style type="text/css">
        #panel {
            position: absolute;
            background-color: white;
            max-height: 90%;
            overflow-y: auto;
            top: 10px;
            right: 10px;
            width: 280px;
        }
        .td1{
			float:left;
			width:50px;
			display: block; 
			valign:middle;
		}
		.td2{
			float:left;
			width:200px;
			display: block; 
			valign:middle;
		}
		.td3{
			float:left;
			width:660px;
			display: block; 
			valign:middle;
		}
		.edui-editor-body .edui-body-container {
			min-height: 300px!important;
		}
		
        .edui-container {
            width:549px!important;
        }
    </style>
</head>
<body>
	<div class="x-body">
            <div   class="form-horizontal" role="form">
              <input id="id" name="id" type="hidden" value="${story.gId}">
			  <div class="form-group">
			  <label for="firstname" class="col-sm-2 control-label">*姓名:</label>
			    <div class="col-sm-3">
			      <input type="text" class="form-control" id="name" name="name" required="required" placeholder="请输入姓名" value="${story.gName}"/>
			    </div>
			  </div>
			  
			  <div class="form-group">
			    <label for="firstname" class="col-sm-2 control-label">*上传头像:</label>
			    <span style="color: red">仅支持JPG、PNG、JPEG、BMP格式，文件小于1M</span>
			    <div class="col-sm-3">
			    	<input id="upload"  type="file" name="file" multiple class="file-loading">
					<input id="picture" name="picture" type="hidden" value="${story.gImg}">
			    </div>
			  </div>
			  
			  <div class="form-group">
			  <label for="firstname" class="col-sm-2 control-label">*薪资:</label>
			    <div class="col-sm-3">
			      <input type="text" class="form-control" id="gPay" name="gPay" required="required" placeholder="请输入薪资" value="${story.gPay}"/>
			    </div>
			  </div>
			  
			  <div class="form-group">
			  <label for="firstname" class="col-sm-2 control-label">*个人宣言:</label>
			    <div class="col-sm-3">
			      <script type="text/plain" id="myEditor" class="form-control">${story.gManifesto}</script>
	              <input type="hidden" id="replyContent" name="replyContent">
			    </div>
			  </div>
			  
			  <div class="form-group">
			  <label for="firstname" class="col-sm-2 control-label">*目前就职:</label>
			    <div class="col-sm-3">
			      <input type="text" class="form-control" id="gTakeOffice" name="gTakeOffice" required="gTakeOffice" placeholder="请输入目前就职" value="${story.gTakeOffice}"/>
			    </div>
			  </div>
			  
			  <div class="form-group">
			  <label for="firstname" class="col-sm-2 control-label">*简介（XXX期XXX学员）:</label>
			    <div class="col-sm-3">
			      <input type="text" class="form-control" id="gStudyTime" name="gStudyTime" required="gTakeOffice" placeholder="请输入简介" value="${story.gStudyTime}"/>
			    </div>
			  </div>

     	<div class="form-group" style="padding-left: 30%">
        
        <button type="submit"   onclick="save()"  class="btn btn-info" >保存</button>
        <button type="reset"    onclick="cancel()"  class="btn btn-info" >取消 </button>
   
     </div>
          </div>
	</div>
        <script src="lib/layui/layui.js" charset="utf-8">
        </script>
        <script src="js/x-layui.js" charset="utf-8">
        </script>
        <!-- 加载需要的js -->
		<script src="js/jquery-3.2.1.min.js"></script>
		<script src="js/common2.js"></script>
		<script src="bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
		<script src="js/jquery-bootstrap-pagination.js"></script>
		<script src="js/qunit-1.11.0.js"></script>
		<script src="js/bootstrap-datetimepicker.js"></script>
		<script src="js/bootstrap-datetimepicker.zh-CN.js"></script>
	    <script src="js/xcConfirm.js" type="text/javascript" charset="utf-8"></script>
	    <script src="bootstrap-fileinput-master/js/fileinput.min.js"></script>
		<script src="bootstrap-fileinput-master/js/locales/zh.js"></script>
		<!--ueditor插件js-->
		<script type="text/javascript"
			src="umeditor/third-party/template.min.js"></script>
		<script type="text/javascript" charset="utf-8"
			src="umeditor/umeditor.config.js"></script>
		<script type="text/javascript" charset="utf-8"
			src="umeditor/umeditor.js"></script>
        <script src="lib/layui/layui.js" charset="utf-8">
        </script>
        <script src="js/x-layui.js" charset="utf-8">
      
        </script>
        <script>
            layui.use(['form','layer','upload'], function(){
                $ = layui.jquery;
              var form = layui.form()
              ,layer = layui.layer;
              });
            
          //时间插件
    		$('.form_date').datetimepicker({
    	        language:  'zh-CN',
    	        weekStart: 1,
    	        todayBtn:  1,
    			autoclose: 1,
    			todayHighlight: 1,
    			startView: 2,
    			minView: 2,
    			forceParse: 0
    	    });
    		$("#upload").fileinput({
	    	    uploadUrl: "upload/photoImg",
	    	    uploadAsync: true,
	    	    maxFileCount: 1,
	    	    initialPreview: [ 
	    	    	'<img src="${story.gImg}"  id="img"  class="file-preview-image"  width="256px" height="160px" />',
	    	    ],
	    	}).on('fileuploaded', function(event, data, previewId, index) {
	    	    var form = data.form, files = data.files, extra = data.extra,
	            response = data.response, reader = data.reader;
	    		if(response.data != null && response.data != ""){
	    	    	$("#picture").val(response.data);			
	    		}else{
	    			alert("图片服务器异常，请重新上传！");
	    		}
	    	});
    		
    		//实例化编辑器
    		var um = UM.getEditor('myEditor');
    		//失去焦点
    		um.addListener('blur', function() {
    			//判断是否有内容
    			if (UM.getEditor('myEditor').hasContents()) {
    				$("#replyContent").val(
    						UM.getEditor('myEditor').getContent());
    			}
    		});

            function save(){
            	 var gId = $("#id").val();
            	 var picture = $("#picture").val();
            	 if(picture == null||picture=="") {
 	   				layer.msg('头像不能为空!',{icon:2,time:2000});
 					  return ;
 	   		   	 }
	           	 var name =	$("#name").val();
	   			 if(name == null||name=="") {
	   				layer.msg('姓名不能为空!',{icon:2,time:2000});
					  return ;
	   		   	 }
	   		   	 var gPay =	$("#gPay").val();
	   		   	 if(gPay == null||gPay=="") {
	   		   		layer.msg('薪资不能为空!',{icon:2,time:2000});
					  return ;
	   		   	 }
	   		     var gManifesto = UM.getEditor('myEditor').getContent();
			   	 if(gManifesto == null||gManifesto=="") {
			   		layer.msg('个人宣言不能为空!',{icon:2,time:2000});
					  return ;
			   	 }
			   	 
			   	var gTakeOffice = $("#gTakeOffice").val();
			   	 if(gTakeOffice == null||gTakeOffice=="") {
			   		layer.msg('目前就职不能为空!',{icon:2,time:2000});
					  return ;
			   	 }
			   	 
			   	var gStudyTime = $("#gStudyTime").val();
			   	 if(gStudyTime == null||gStudyTime=="") {
			   		layer.msg('简介不能为空!',{icon:2,time:2000});
					  return ;
			   	 }
	   			 var  data = {"gId":gId,"gImg":picture,"gName":name,"gPay":gPay,"gManifesto":gManifesto,"gTakeOffice":gTakeOffice,"gStudyTime":gStudyTime}
	   	         
	   	         $.ajax({
	   	             type: "post",
	   	             url: "studentStory/addOrUpdate",
	   	             data: JSON.stringify(data),
	   	             contentType:"application/json;charset=UTF-8", 
	   	             dataType:"json",
	   	             success: function(data){    
	   	           	  if(data.code==200){
	   	           	layer.alert(data.msg, {icon: 6},function () {
	   	           		parent.location.reload();
		                    // 获得frame索引
		                    var index = parent.layer.getFrameIndex(window.name);
		                    //关闭当前frame
		                    parent.layer.close(index);
		                     parent.location.reload();
		                });    
		       }else{
		    	      var txt=data.msg;
		      	    	   layer.alert(txt); 
		      	       }
	               }
	   	         });  
	   	         
   			}
   	   
   	   function cancel(){
   		   	
   		// 获得frame索引
           var index = parent.layer.getFrameIndex(window.name);
           //关闭当前frame
           parent.layer.close(index);
   	         
   			}
        </script>
</body>
</html>